<template>
  <a-card :bordered='false'>
    <!-- 查询区域 -->
    <div class='table-page-search-wrapper'>
      <a-form layout='inline' @keyup.enter.native='searchQuery'>
        <a-row :gutter='24'>
          <a-radio-group v-model='queryParam.yearStatus' @change='radioChange'>
            <a-form-item label='审核状态'>
              <a-radio :value='0'>本年度</a-radio>
              <a-radio :value='1'>全部</a-radio>
            </a-form-item>
          </a-radio-group>
        </a-row>
        <a-row :gutter='24'>
          <a-col :xl='6' :lg='7' :md='8' :sm='24'>
            <a-form-item label='月份'>
              <!--              <a-input placeholder='请输入月份' v-model='queryParam.issueTime' />-->
              <a-month-picker v-model='queryParam.selectedMonth' style='width:100%' placeholder='请选择月份'
                              @change='monthChange' />
            </a-form-item>
          </a-col>
          <a-col :xl='6' :lg='7' :md='8' :sm='24'>
            <a-form-item label='员工姓名'>
              <a-input placeholder='请输入员工姓名' v-model='queryParam.name' />
            </a-form-item>
          </a-col>
          <a-col :xl='6' :lg='7' :md='8' :sm='24'>
            <span style='float: left;overflow: hidden;' class='table-page-search-submitButtons'>
              <a-button type='primary' @click='searchQuery' icon='search'>查询</a-button>
              <a-button type='primary' @click='searchReset' icon='reload' style='margin-left: 8px'>重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <div>
      <a-table
        ref='table'
        size='middle'
        :scroll='{x:true}'
        bordered
        rowKey='id'
        :columns='columns'
        :dataSource='dataSource'
        :pagination='ipagination'
        :loading='loading'
        class='j-table-force-nowrap'
        @change='handleTableChange'>
        <template slot='countBeforeSale' slot-scope='text, record'>
           <span v-if='record.month !=="合计"'>
             <a @click='handleDetail(record)'>{{ text }}</a>
          </span>
          <span v-else>{{ text }}</span>
        </template>
        <template slot='htmlSlot' slot-scope='text'>
          <div v-html='text'></div>
        </template>
        <template slot='imgSlot' slot-scope='text'>
          <span v-if='!text' style='font-size: 12px;font-style: italic;'>无图片</span>
          <img v-else :src='getImgView(text)' height='25px' alt=''
               style='max-width:80px;font-size: 12px;font-style: italic;' />
        </template>
        <template slot='fileSlot' slot-scope='text'>
          <span v-if='!text' style='font-size: 12px;font-style: italic;'>无文件</span>
          <a-button
            v-else
            :ghost='true'
            type='primary'
            icon='download'
            size='small'
            @click='downloadFile(text)'>
            下载
          </a-button>
        </template>
      </a-table>
      <a-row>
        <a-col :span='8'>
          <a-card style='text-align:left;line-height:30px'>
            <a-statistic title='工资（元）' :value='Salary' />
          </a-card>
        </a-col>
        <a-col :span='8'>
          <a-card style='text-align:left;line-height:30px'>
            <a-statistic title='五险一金（元）' :value='FiveInsurancePayment' />
          </a-card>
        </a-col>
        <a-col :span='8'>
          <a-card style='text-align:left;line-height:30px'>
            <a-statistic title='报销金额（元）' :value='ReimbursementTotal' />
          </a-card>
        </a-col>
        <a-col :span='12'>
          <a-card style='text-align:left;line-height:30px'>
            <a-statistic title='收入金额（元）' :value='SaleIncome' />
          </a-card>
        </a-col>
        <a-col :span='12'>
          <a-card style='text-align:left;line-height:30px'>
            <a-statistic title='合计（元）' :value='SubTotal' />
          </a-card>
        </a-col>
      </a-row>

    </div>
    <bus-salebefore-activity-list-model ref='busSalebeforeActivityListModel'></bus-salebefore-activity-list-model>
  </a-card>
</template>

<script>

import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import HfPsPersonalCheckModal from './modules/HfPsPersonalCheckModal'
import { sorter } from '@/utils/sorter'
import { getAction } from '@api/manage'
import { splitByNum, toFixedTwo } from '@/utils/util'
import BusSalebeforeActivityListModel from '@views/hifar/business/modules/BusSalebeforeActivityListModel'
import moment from 'moment'

export default {
  name: 'HfPsPersonalCheckList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    BusSalebeforeActivityListModel,
    HfPsPersonalCheckModal
  },
  data() {
    return {
      isorter: {
        column: 'month',
        order: 'asc'
      },
      description: '个人核算管理页面',

      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },

        {
          title: '月份',
          align: 'center',
          sorter: true,
          dataIndex: 'month'
        },
        {
          title: '姓名',
          align: 'center',
          sorter: true,
          dataIndex: 'name'
        },
        {
          title: '职位',
          align: 'center',
          dataIndex: 'job'
        },
        {
          title: '所属中心',
          align: 'center',
          dataIndex: 'auditGrade_dictText',
          customRender: (text) => {
            return !text ? '---' : text
          }
        },
        {
          title: '收入金额',
          align: 'center',
          dataIndex: 'saleIncome',
          customRender: (t, item, index) => {
            return splitByNum(+t)
          }
        },
        {
          title: '工资',
          align: 'center',
          dataIndex: 'salary',
          customRender: (t, item, index) => {
            return splitByNum(+t)
          }
        },
        {
          title: '五险一金',
          align: 'center',
          dataIndex: 'fiveInsurancePayment',
          customRender: (t, item, index) => {
            return splitByNum(+t)
          }
        },
        {
          title: '月度报销',
          align: 'center',
          dataIndex: 'reimbursementTotal',
          customRender: (t, item, index) => {
            return splitByNum(+t)
          }
        },
        {
          title: '售前天数',
          align: 'center',
          dataIndex: 'countBeforeSale',
          scopedSlots: { customRender: 'countBeforeSale' }
        },
        {
          title: '小计',
          align: 'center',
          dataIndex: 'subTotal',
          // scopedSlots: { customRender: 'subTotal' },
          customRender: (t, item, index) => {
            return <span style={{ color: t < 0 ? 'red' : 'darkgreen' }}>{splitByNum(+t)}</span>
          }
        }

      ],
      url: {
        list: '/ps/hfPsSaleCheck/saleCheckList',
        sum: '/ps/hfPsSaleCheck/sum'
      },
      dictOptions: {},
      queryModel: true,
      queryParam: {
        yearStatus: 0 //默认本年度
      },
      selectedMonth: '',
      SaleIncome: 0,
      Salary: 0,
      FiveInsurancePayment: 0,
      ReimbursementTotal: 0,
      SubTotal: 0,
      CountBeforeSale: 0
    }
  },
  created() {
  },
  computed: {
    importExcelUrl: function() {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    }
  },
  methods: {
    monthChange(date) {
      this.selectedMonth = moment(date).format('YYYY-MM')
    },
    handleDetail: function(record) {
      this.$nextTick(() => {
        this.$refs.busSalebeforeActivityListModel.querySaleBeforeActivity(record)
        this.$refs.busSalebeforeActivityListModel.title = '售前支持详情'
      })
    },
    searchReset() {
      this.queryParam = {}
      this.queryParam.yearStatus = 0
      this.selectedMonth = ''
      this.loadData(1)
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1
      }
      var params = this.getQueryParams()//查询条件
      params.month = this.selectedMonth
      params.realname = this.queryParam.name ? '*' + this.queryParam.name + '*' : this.queryParam.name
      delete params.selectedMonth
      this.loading = true
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
          this.dataSource = res.result.records || res.result
          if (res.result.total) {
            this.ipagination.total = res.result.total
          } else {
            this.ipagination.total = 0
          }
          //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
      this.getSum(params)
    },
    getSum(params) {
      getAction(this.url.sum, params).then((res) => {
        if (res.success) {
          this.SaleIncome = res.result.SaleIncome.toFixed(2)
          this.Salary = res.result.Salary.toFixed(2)
          this.FiveInsurancePayment = res.result.FiveInsurancePayment.toFixed(2)
          this.ReimbursementTotal = res.result.ReimbursementTotal.toFixed(2)
          this.SubTotal = res.result.SubTotal.toFixed(2)

        }
      })
    },
    radioChange() {
      this.loadData()
    },
    initDictConfig() {
    }

  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>